<html>
	<head>  
		<meta charset="UTF-8"/>
		<title>框架柱工具</title>
		
		<style>
			body{
				background-color: #f0f0f0;
				width: 600px;
				height: 800px;
			}
            input{
               width: 50px;
            }
        
		</style>
  </head> 
	
	<body>

		<table>
            <tr>
                <td>b边长度：</td>
                <td><input id="bbcd" type="text" value="750">(mm)&nbsp;&nbsp;&nbsp;&nbsp; </td>
                <td>h边长度：</td>
                <td><input id="hbcd" type="text" value="700">(mm)</td>
                <td rowspan="9">
                    <input id="cb1" type="checkbox"  checked>画柱边框定位<br><br>
                    <input id="cb2" type="checkbox" checked>画柱保护层定位<br><br>
                    <input id="cb3" type="checkbox"  checked>画柱外箍净档定位<br><br>
                    <input id="cb4" type="checkbox"  checked>画柱角筋定位<br><br>
                    <input id="cb5" type="checkbox"  checked>画柱边筋定位<br><br>
                    <input id="cb6" type="checkbox"  checked>画柱角筋<br><br>
                    <input id="cb7" type="checkbox" checked>画柱边筋<br><br>
                    <input id="cb8" type="checkbox"  checked>画柱箍筋定位<br><br>
                    <input id="cb9" type="checkbox"  checked>画柱外箍筋<br><br>
                    <input id="cb10" type="checkbox" checked>画柱内箍筋<br><br>

                </td>
            </tr>
            <tr>
                <td>保护层厚度：</td>
                <td><input id="bhchd" type="text" value="25">(mm)</td>
                <td>箍筋直径：</td>
                <td><input id="gjzj" type="text" value="10">(mm)</td>
            </tr>
            <tr>
                <td>角筋直径：</td>
                <td><input id="jjzj" type="text" value="25">(mm)</td>
                <td>角筋数量：</td>
                <td><input id="jjsl" type="text" value="4"></td>
            </tr>
            <tr>
                <td>b边筋直径：</td>
                <td><input id="bbjzj" type="text" value="25">(mm)</td>
                <td>b边筋数量：</td>
                <td><input id="bbjsl" type="text" value="6"></td>
            </tr>
            <tr>
                <td>h边筋直径：</td>
                <td><input id="hbjzj" type="text" value="25">(mm)</td>
                <td>h边筋数量：</td>
                <td><input id="hbjsl" type="text" value="6"></td>
            </tr>
            <tr>
                <td>左下角首筋是否高桩：</td>
                <td><select id="sjgd">
                    <option value="true"> 是 </option>
                    <option value="false"> 否 </option>
                </select></td>
                
            </tr>
            <tr>
                <td>高桩伸出长度：</td>
                <td><input id="gzcd" type="text" value="2500">(mm)</td>
                <td>低桩伸出长度：</td>
                <td><input id="dzcd" type="text" value="1500">(mm)</td>
            </tr>
            <tr>
                <td>弯锚筋直段锚入长度：</td>
                <td><input id="wmjzc" type="text" value="1200">(mm)</td>
                <td>直锚筋锚入长度：</td>
                <td><input id="zmjzc" type="text" value="850">(mm)</td>
            </tr>
            <tr>
                <td>b边箍筋肢数：</td>
                <td><input id="bbgjzs" type="text" value="6"></td>
                <td>h边箍筋肢数：</td>
                <td><input id="hbgjzs" type="text" value="6"></td>
            </tr>



        </table>
        
    
		<div style="text-align: center;margin: 30px;">
			<input type="button" value="确定" onclick="confirm()">&nbsp;&nbsp;&nbsp;&nbsp;
			<input type="button" value="取消" onclick="cancel()">
		</div>
        <div>
            <input type="file" name="pic" >

        </div>
	</body>
	<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
	<script>
		function confirm(){
			var bbcd = $("#bbcd").val();
			var hbcd = $("#hbcd").val();
			var bhchd = $("#bhchd").val();
            var gjzj = $("#gjzj").val();
			var jjzj = $("#jjzj").val();
			var jjsl = $("#jjsl").val();
            var sjgd = $("#sjgd option:selected").val()
            var bbjzj = $("#bbjzj").val();
			var bbjsl = $("#bbjsl").val();
			var hbjzj = $("#hbjzj").val();
            var hbjsl = $("#hbjsl").val();
			var gzcd = $("#gzcd").val();
			var dzcd = $("#dzcd").val();
            var wmjzc = $("#wmjzc").val();
			var zmjzc = $("#zmjzc").val();
            var bbgjzs = $("#bbgjzs").val();
			var hbgjzs = $("#hbgjzs").val();

            var cb1 = $("#cb1").is(':checked');
            var cb2 = $("#cb2").is(':checked');
            var cb3 = $("#cb3").is(':checked');
            var cb4 = $("#cb4").is(':checked');
            var cb5 = $("#cb5").is(':checked');
            var cb6 = $("#cb6").is(':checked');
            var cb7 = $("#cb7").is(':checked');
            var cb8 = $("#cb8").is(':checked');
            var cb9 = $("#cb9").is(':checked');
            var cb10 = $("#cb10").is(':checked');
			
			var data_arr = [bbcd, hbcd, bhchd, gjzj, jjzj, jjsl,sjgd, bbjzj,bbjsl,hbjzj,hbjsl,gzcd,dzcd,wmjzc,zmjzc,bbgjzs,hbgjzs,
                            cb1,cb2,cb3,cb4,cb5,cb6,cb7,cb8,cb9,cb10]
			sketchup.confirm(data_arr); //数据传输到ruby后台
		}
		function cancel(){
			sketchup.cancel();
		}
	</script>
</html>
